<template>
	
	<view>
		<!-- <view class="cardBox" >
			<block v-for="(item,index) in Stock_list" :key="index">
				<view>
					<view style="display: flex;width: 100%;margin-top: 30rpx;">
						<view style="width: 65%;display: flex;">
							<view class="circle_dian2" style="color: #999;line-height: 20px;" >·</view>
							<view class="cardTitle2">
								{{text.Stock2}}{{item.address}} 
							</view>
						</view>
						<view style="width: 35%;font-size: 12px;">
							{{item.create_at}} 
						</view>
					</view>
				</view>
				<view style="height: 30rpx;width: 100%;"></view>
			</block>
			<block v-if="Stock_list.length==0" >
				<view>{{text.wait}}</view>
			</block>
		</view> -->
		
		<view class="cardBox" >
		<!-- <view> -->
			
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao" style="width: 100%;display: flex;">
					<span class="biao_span">|</span> 
					<text class="cardTitle" style="width: 100%;">{{text.xieyi}} </text>
					 <view class="jiantou" style="height: auto;line-height: unset; font-weight: 500;position: relative;z-index: 33;" @click="wuliu(order)">
					 	>
					 </view>
				</view>
			</view>
			
			
			<!--始发地与目的地-->
			<!-- <view class="flex" style="margin-top: 10rpx;position: relative;z-index: 33;" @click="wuliu(order)">
			
				<view class="cardBox2" v-if="order.orderInfo.type=='transport'||order.orderInfo.type=='crossborder'">
					<view class="flex" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.start_address}} </text>
					</view>
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-if="lang=='zh'">
						{{order.orderInfo.release_info.departure_city.country_name||''}},{{order.orderInfo.release_info.departure_city.province_name||''}},{{order.orderInfo.release_info.departure_city.city_name||''}},{{order.orderInfo.release_info.departure_city.area_name||''}}
					</view>
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-else>
						{{order.orderInfo.release_info.departure_city.country_name_ru||''}},{{order.orderInfo.release_info.departure_city.province_name||''}},{{order.orderInfo.release_info.departure_city.city_name_ru||''}},{{order.orderInfo.release_info.departure_city.area_name_ru||''}}
					</view>
				</view>
				<view class="cardBox2" v-else-if="order.orderInfo.type=='goods'">
					<view class="flex" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.start_address}} </text>
					</view>
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-if="lang=='zh'">
						{{order.orderJoin.product_address.country_name||''}},{{order.orderJoin.product_address.province_name||''}},{{order.orderJoin.product_address.city_name||''}},{{order.orderJoin.product_address.area_name||''}}
					</view>
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-else>
						{{order.orderJoin.product_address.country_name_ru||''}},{{order.orderJoin.product_address.province_name_ru||''}},{{order.orderJoin.product_address.city_name_ru||''}},{{order.orderJoin.product_address.area_name_ru||''}}
					</view>
				</view>
				
				<view class="cardBox2">
					<view class="flex" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.end_address}} </text>
					</view>
					
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-if="lang=='zh'">
						{{order.orderInfo.release_info.reach_city.country_name||''}},{{order.orderInfo.release_info.reach_city.province_name||''}},{{order.orderInfo.release_info.reach_city.city_name||''}},{{order.orderInfo.release_info.reach_city.area_name||''}}
					</view>
					<view class="text" style="margin-top: 10rpx;font-size: 12px;" v-else>
						{{order.orderInfo.release_info.reach_city.country_name_ru||''}},{{order.orderInfo.release_info.reach_city.province_name_ru||''}},{{order.orderInfo.release_info.reach_city.city_name_ru||''}},{{order.orderInfo.release_info.reach_city.area_name_ru||''}}
					</view>
				</view>
			</view> -->
			
			<!--添加收货人-->
			<!-- <view class="flex" style="margin-top: 10rpx;" v-if="(order.orderInfo.type=='goods' && order.orderInfo.release_info.is_express_price==2)||order.orderInfo.type=='transport'||order.orderInfo.type=='crossborder'">
				<view class="biao" style="width: 100%;">
					<span class="biao_span">|</span> 
					<text class="cardTitle" >{{$t("收货人信息")}} </text>
					<view style="float: right;" v-if="order.role==1 || (order.orderInfo.type=='transport' && order.orderInfo.release_info.release_type==3 && order.orderInfo.release_info.human_type==2) || (order.orderInfo.type=='transport' && order.orderInfo.release_info.release_type==1)">
						<view class="order_info_btn orange" style="float: right;" @click="xgConsignee(order)" v-if="order.orderInfo.consignee && order.orderInfo.consignee_tel">{{text.edit_info}}</view>
						<view class="order_info_btn orange" style="float: right;" @click="saveConsignee(order)" v-else>{{text.add_consignees}}</view>
					</view>
					<view style="clear: both;"></view>
				</view>
			</view>
			
			<view v-if="(order.orderInfo.type=='goods' && order.orderInfo.release_info.is_express_price==2)||order.orderInfo.type=='transport'||order.orderInfo.type=='crossborder'">
				<view class="cardBox2" style="width:95%" v-if="order.orderInfo.consignee && order.orderInfo.consignee_tel">
					<view class="flex" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.consignee_name}} : {{order.orderInfo.consignee}}</text>
					</view>
					
					<view class="text" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.mobile}} : {{order.orderInfo.consignee_tel}}</text>
					</view>
				</view>
			</view> -->
			
			
			<!--添加口岸交接人-->
			<!-- <view class="flex" style="margin-top: 10rpx;" v-if="order.orderInfo.type=='crossborder'">
				<view class="biao" style="width: 75%;">
					<span class="biao_span">|</span> 
					<text class="cardTitle">{{$t("口岸交接人信息")}} </text>
				</view>
				<view class="edit" @click="xgKaConsignee()" v-if="order.orderInfo.kaconsignee && order.orderInfo.kaconsignee_tel && order.role==2">{{$t("修改交接人")}}</view>
				<view class="edit" @click="saveKaConsignee()" v-else-if="!order.orderInfo.kaconsignee && !order.orderInfo.kaconsignee_tel && order.role==2">{{$t("添加交接人")}}</view>
			</view>
			
			<view v-if="order.orderInfo.type=='crossborder'">
				<view class="cardBox2" style="width:95%" v-if="order.orderInfo.kaconsignee && order.orderInfo.kaconsignee_tel">
					<view class="flex" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{$t("口岸交接人")}} : {{order.orderInfo.kaconsignee}}</text>
					</view>
					<view class="text" style="margin-top: 10rpx;">
						<text class="cardTitle" style="font-size: 12px;">{{text.mobile}} : {{order.orderInfo.kaconsignee_tel}}</text>
					</view>
				</view>
			</view> -->
			
			
			<!--添加司机-->
			<!-- <view class="flex" style="margin-top: 10rpx;" v-if="order.orderInfo.type=='transport'">
				<view class="biao" style="width: 100%;">
					<span class="biao_span">|</span> 
					<text class="cardTitle" >{{text.driver}} </text>
					<view style="float: right;" v-if="order.role==2">
						<view class="order_info_btn orange" style="float: right;" @click="xgDriver(order)" v-if="order.orderInfo.driver && order.orderInfo.driver_tel">{{text.edit_info}}</view>
						<view class="order_info_btn orange" style="float: right;" @click="saveDriver(order)" v-else>{{text.add_driver}}</view>
					</view>
					<view style="clear: both;"></view>
				</view>
			</view>
			
			<view style="width: 100%;" v-if="order.orderInfo.driver && order.orderInfo.driver_tel && order.orderInfo.type=='transport'">
				<view style="margin:0rpx 3%;margin-top: 20rpx;">
					{{$t('运输方式')}} : {{$t(release_transport||'')}}
				</view>
				<view style="margin:0rpx 3%;margin-top: 20rpx;">
					{{$t('车辆信息')}} : {{order.orderInfo.driver_number||''}}
				</view>
				<view class="flex" style="margin-top: 10rpx;" v-if="driver_img.length!=0">
					<image :src="item.url" class="order_img" v-for="(item,index) in driver_img" :key="index" 
					style="margin:0rpx 3%;margin-top: 20rpx;float: left;"></image>
				</view>
				<view style="clear: both;"></view>
				
				<view style="margin:0rpx 3%;margin-top: 20rpx;">
					{{$t('司机名称')}} : {{order.orderInfo.driver}}
				</view>
				<view style="margin:0rpx 3%;margin-top: 20rpx;">
					{{$t('联系方式')}} : {{order.orderInfo.driver_tel}}
				</view>
			</view> -->
			
			<view style="height: 10rpx;width: 100%;"></view>
		</view>
	</view>
	
</template>

<script>
	import {HTTP_REQUEST_URL,HTTP_IMG_UTL,IMAGE_URL} from "@/config/app";
	
	export default {
		components: {
			
		},
		props: {
			order: {
				type: [Array, Object, Number, String],
				default: ''
			},
		},
		data() {
			return {
				//远程域名
				HTTP_IMG_UTL,
				HTTP_REQUEST_URL,
				IMAGE_URL,
				url: IMAGE_URL,
				
				release_transport:'',
				//语言
				lang: this.$i18n.locale,
				//文字
				text:{
					start_address:this.$t('始发地'),
					end_address:this.$t('目的地'),
					xieyi:this.$t('物流信息'),
					consignees:this.$t('收货人信息'),
					consignee_name:this.$t('收货人名称'),
					add_consignees:this.$t('添加收货人'),
					mobile:this.$t('联系方式'),
					edit_info:this.$t('修改信息'),
					Stock:this.$t('货物已到达'),
					Stock2:this.$t('货物已到达'),
					wait:this.$t('暂未获取到物流动态'),
					driver:this.$t('车辆及司机信息'),
					add_driver:this.$t('添加司机'),
				},
				
				
				//进度
				Stock_list:[
					{address:'123',status:1,text:"",create_at:'2023-06-07 20:05'},
					{address:'345',status:1,text:'这里是进度说明这里是进度说明这里是进度说明这里是进度说明',create_at:'2023-06-07 20:05'},
					{address:'565',status:1,text:'',create_at:'2023-06-07 20:05'},
					{address:'757',status:1,text:'',create_at:'2023-06-07 20:05'},
					{address:'444',status:1,text:'',create_at:'2023-06-07 20:05'},
				],
				cfd:'',
				mdd:'',
				cfd_ru:'',
				mdd_ru:'',
				
				driver_img:[]
			}
		},
		mounted() {
			// console.log(this.order);
			this.cfd=this.order.orderInfo.release_info.departure_city.mergename
			this.cfd_ru=this.order.orderInfo.release_info.departure_city.mergename_ru
			this.mdd=this.order.orderInfo.release_info.reach_city.mergename
			this.mdd_ru=this.order.orderInfo.release_info.reach_city.mergename_ru
			
			var that  =this
			if(this.order.orderInfo.driver_images){
				var image = this.order.orderInfo.driver_images.split(',');
				var arr = [];
				for(var i=0;i<image.length;i++){
					arr.push({url:that.IMAGE_URL+image[i]});
				}
				that.driver_img=arr
			}
			if(that.order.orderJoin){
				if(that.order.orderJoin.release_transport){
					that.release_transport = that.order.orderJoin.release_transport.text
				}
			}
			
		},
		methods:{
			saveConsignee(order){
				this.$u.route({
					url: "/pages/ordering/detail/Consignee",
					params: {
						id: this.order.orderInfo.id,
						join_order_id:this.order.orderInfo.join_order_id,
						status:this.order.orderJoin.status,
					}
				})
			},
			saveKaConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/KaConsignee",
					params: {
						id: this.order.orderInfo.id,
						join_order_id:this.order.orderInfo.join_order_id,
						status:this.order.orderJoin.status,
					}
				})
			},
			xgConsignee(order){
				this.$u.route({
					url: "/pages/ordering/detail/Consignee",
					params: {
						id: this.order.orderInfo.id,
						join_order_id:this.order.orderInfo.join_order_id,
						status:this.order.orderJoin.status,
						xg:1,
					}
				})
			},
			xgKaConsignee(){
				this.$u.route({
					url: "/pages/ordering/detail/KaConsignee",
					params: {
						id: this.order.orderInfo.id,
						join_order_id:this.order.orderInfo.join_order_id,
						status:this.order.orderJoin.status,
						xg:1,
					}
				})
			},
			saveDriver(order){
				this.$u.route({
					url: "/pages/ordering/detail/Driver",
					params: {
						id: this.order.orderInfo.id,
						join_order_id:this.order.orderInfo.join_order_id,
						status:this.order.orderJoin.status,
					}
				})
			},
			xgDriver(order){
				this.$u.route({
					url: "/pages/ordering/detail/Driver",
					params: {
						id: order.orderInfo.id,
						join_order_id:order.orderInfo.join_order_id,
						status:order.orderJoin.status,
						xg:1,
					}
				})
			},
			wuliu(order){
				this.$u.route({
					url: "/pages/textbook/logistics",
					params: {
						id: order.orderInfo.id,
						join_order_id:order.orderInfo.join_order_id,
						status:order.orderJoin.status,
					}
				})
			}
		}
	}
</script>

<style lang="scss" >
	@import "@/common/orderDetail.scss";
	.cardBox2{
		background-color: #eeeeee;
		padding-bottom: 40rpx;
		color: #999999;
		font-size: 12px;
	}
	.edit{color: white; background-color: orange;font-size: 12px; border-radius: 10rpx; padding: 10rpx 15rpx; text-align: center;}
</style>